import React from 'react';

import DocumentTitle from 'react-document-title';
import { enquireScreen } from 'enquire-js';

import GlobalHeader from '@/components/GlobalHeader';
import GlobalFooter from '@/components/GlobalFooter';

import 'rc-texty/assets/index.css'

import styles from './style.less';

let isMobile;

enquireScreen((b) => {
  isMobile = b;
});

class BasicLayout extends React.PureComponent {
  state = {
    title: '首页-网约车',
  }

  componentDidMount() {
    enquireScreen((b) => {
      console.log(b)
      this.setState({
        isMobile: !!b,
      });
    });
  }

  handleChangeTitle = (value = '') => {
    this.setState(state=>({
      ...state,
      title: value,
      isMobile,
    }));
  }

  render() {
    return (
      <DocumentTitle title={this.state.title}>
        <>
          <GlobalHeader isMobile={this.state.isMobile} />
          {this.props.children}
          <GlobalFooter isMobile={this.state.isMobile} />
          <ul className={styles.right_frame}>
            <li className={styles.qq}><a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=1090127630&site=qq&menu=yes" /></li>
            <li className={styles.wechat}>
              <a />
            </li>
            <li className={styles.phone}>
              <a target="_blank" href="tel:18573099808">18573099808</a>
            </li>
          </ul>
        </>
      </DocumentTitle>
    );    
  }
}

export default BasicLayout;